<template>
     <div class="des">
        <section>
          <img :src="storesrc" alt="">
          <span v-text="title"></span>
        </section>
        <div class="nei">
          <div class="quan">券后￥</div>
          <div class="money" v-text="money"></div>
          <div class="lastMoney" v-text="'￥'+lastMoney"></div>
          <div class="commission" v-text="'佣金￥'+commission"></div>
          <div class="salesNumber" v-text="'销量'+salesNumber"></div>
        </div>
      {{obj}}
      </div>
</template>

<script>
export default {
  data() {
    return {
      storesrc: '',
      title: '',
      money: '',
      lastMoney: '',
      commission: '',
      salesNumber: '',
    };
  },
  computed: {
    obj() {
      if (this.$store.state.Home.list.length != 0) {
        this.$store.state.Home.list.forEach((v) => {
          if (v.id == this.idkey) {
            this.storesrc=v.storeSrc
            this.title=v.title
            this.money=v.money
            this.lastMoney=v.lastMoney
            this.commission=v.commission
            this.salesNumber=v.salesNumber
            return v.src;
          }
        });
        return null;
      } else {
        return null;
      }
    }
  },
  props:['idkey'],
};
</script>

<style scoped>
.des {
  min-height: 74rem;
  border-bottom: 6rem solid #fafafa;
  padding: 0 12rem;
}
section{
  font-size: 13rem;
  line-height: 19rem;
  margin-top: 6rem;
}
section img{
  width: 16rem;
  height: 16rem;
  margin-right: 5rem;
  vertical-align: middle;
}
.nei{
  display: flex;
  line-height: 46rem;
  height: 46rem;
}
.nei .quan{
  font-size: 13rem;
  color: #e97373;
  margin-right: 5rem;
}
.nei .money{
  font-size: 18rem;
  color: #e97373;
  margin-right: 12rem;
}
.nei .lastMoney{
  font-size: 12rem;
  color: #bfc0c2;
  margin-right: 75rem;
  text-decoration: line-through;
}
.nei .commission{
  font-size: 12rem;
  color: #ecb443;
  margin-right: 24rem;
}
.nei .salesNumber{
  font-size: 12rem;
  color: #bfc0c2;
}
</style>